<!--
 * @Description: 
 * @Date: 2020-12-15 17:18:19
 * @LastEditors: lother
 * @LastEditTime: 2021-01-04 16:49:15
 * @FilePath: \AccountOpening-H5\src\components\page\k-input.vue
-->
<template>
        <van-field
            v-model="value"
            :label="list['title_'+langSuff]"
            :placeholder="$t('login.index.5638rk3g0080')+list['title_'+langSuff]"
            :required="required"
            :rules="rulesList"
            clearable
            center
            
        />
</template>
<script>
export default {
    name:"k-input",
    props:{
        val:{
            type:String,
            default:""
        },
        list:{
            type:Object,
            default:()=>{}
        }
    },
    computed:{
        required(){
            var boll = (this.list?.is_require)?true:false
            return boll
        },
        langSuff(){
            return this.$store.state.langSuff
        },
        maxlength(){
            var  reg = /^\d{1,}$/
            if((this.list?.maxlength || this.list?.maxlength !== 0)  && reg.test(this.list?.maxlength) ){
                return  this.list.maxlength 
            }
        },
        rulesList(){
            var arr=[]
            if(this.list?.is_require){
                arr.push({ required: true, message: this.$t('login.index.5638rk3g0080')+this.list['title_'+this.langSuff] })
            }
            var  reg = /^\d{1,}$/
            if( (this.list?.maxlength || this.list?.maxlength !== 0 ) && reg.test(this.list?.maxlength)){
                arr.push({ validator: this.asyncValidator,message: this.list['title_'+this.langSuff]+this.$t('login.index.5638vbml6sw0')+this.list.maxlength+this.$t('login.index.5638vz3jq1c0') })
            }
            var rules  = this.list?.rule ?? [];
            for (let index = 0; index < rules.length; index++) {
                const item = rules[index];
                if(item.rule!==''){
                    arr.push({pattern:this.evalreg(item.rule) , message : item['error_tip_'+this.langSuff]})
                }
            }
            return arr
        }
    },
    data() {
        return {
            value:""
        }
    },
    created(){
        this.value = this.val
    },
    methods:{
        evalreg(val) {
            val = val || "";
            return RegExp(val);
        },
        asyncValidator(val) {
            var bOll;
            if(val.length>this.list.maxlength ){
                bOll= false
            }else{
                bOll= true
            }
            return bOll
        },
    },
    watch:{
        value:{
            handler(val,old){
                this.$emit('update:val',val)
            }
        },
        val(val){
            this.value = val
        }
    }
}
</script>